<template>
  <div class="home">
   
  </div>
</template>

<script lang="ts" setup>
    // node node-sass sass-loader 的版本匹配
    // node 14   node-sass 4  sass-loader 8
    // node 16   node-sass 5  sass-loader 10
    // node 18   node-sass 6  sass-loader 11
    // node 20   node-sass 7  sass-loader 12


      // typescript  ts是js的超集 
      // ts 是js的扩展 ts 需要编辑成js才能运行
      // ts 是js的强类型语言 js是弱类型语言
      // ts需要安装 npm i typescript -g  全局安装
      // tsc 文件名    编译ts文件为js 
      // ts可以在 编码阶段提示错误 js只能在运行阶段提示错误


      // ts 的类型
      // 基本类型 number  string  boolean  null  undefined  symbol  
      let a:number=1;
      a=88;

      let b:string="hello"
      b="你好"

      let flag:boolean;
      flag=true;
      // null类型
      let c:null=null; // null 
     // undefined类型
      let city:undefined; // undefined
    //  symbol 类型 唯一
      let ftc:symbol=Symbol("hello");

  
        // !! ts联合类型  |
        let myname:string|number|boolean;
        myname="dasfg"
        myname=88;
        myname=true;
        console.log(myname)


      // array  tuple  enum  any  void  never  object  unknown
      // array 数组类型   写法1  :类型[]  写法2  Array<类型>

      let arr:number[]=[34,5,4,65,567,45];
      let arr1:Array<number>=[34,45,23,34,34]//泛型写法

        // string或number类型的数组
        let arr3:(string|number)[]=["sdf",123,"asdf"]
        let arr4:Array<string|number>=["sdf",123,"asdf"] //泛型写法
        
        //!! ts 的any类型  任意类型
        let arr5:any="sdf"
        arr5=[1,3,4,5]
        arr5={
          name:1,
          age:2
        }
        // ts 元组 tuple  固定长度的数组
        // 元组的 每一项的类型 都需要指定
    let arr7:[string,number,string,boolean,number[]]=["1",2,"df",true,[7,6]]

    // 枚举类型enum   枚举类型的作用是给一组数值赋予友好的名字
    // 枚举在没有赋值的情况下 默认从0 开始递增
    // 数字会从初始的值递增
        enum Color{
          red=5,
          green,
          blue
        }
     console.log(Color.green) //1
        // 在接口的 地址 集中管理 
     enum ApiUrl{
        loginApi="/api/login",
        regApi="/api/reg"
     }
  
    // let  getPhone =()=>{
    //   return request({
    //     url:ApiUrl.loginApi,
    //   })
    // }

    // 

      // object 对象类型
      let obj:object={
        name:1,
        age:2
      }
      let listData:object[]=[{name:1,age:2},{name:3,age:4}]

      // unknown  未知类型  需要在类型断言后使用
      let df:unknown;//未知类型
      df="afsf"
    

      
      

      











</script>
